import 'package:earclean/app/config/colors.dart';
import 'package:earclean/app/modules/widget/app_bar_widget.dart';
import 'package:earclean/app/modules/widget/load_network_image_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import 'package:get/get.dart';

import '../controllers/serve_controller.dart';

class ServeView extends GetView<ServeController> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: const AppBarWidget(
          backgroundColor: ColorConfig.white,
          showLeading: false,
          titleStr: '健康服务'),
      body: Column(
        children: [
          titleWidget(),
          const SizedBox(height: 10),
          Expanded(child: tuijianWidget1()),
        ],
      ),
    );
  }

  Widget titleWidget() {
    return Container(
      height: 45,
      width: 1.sw,
      padding: const EdgeInsets.symmetric(horizontal: 18),
      color: ColorConfig.white,
      child: Obx(() => ListView.separated(
          scrollDirection: Axis.horizontal,
          padding: EdgeInsets.zero,
          shrinkWrap: true,
          itemBuilder: ((context, index) {
            Map item = controller.dataList[index];
            return InkWell(
              onTap: () {
                controller.clickItem(index);
              },
              child: Container(
                constraints: BoxConstraints(minWidth: .2.sw),
                padding:
                    const EdgeInsets.symmetric(vertical: 5, horizontal: 15),
                child: Center(
                  child: Obx(() => Text(item['class'] ?? "",
                      style: TextStyle(
                          fontSize: 16.sp,
                          color: controller.index.value == index
                              ? ColorConfig.app_main
                              : ColorConfig.text_label,
                          fontWeight: FontWeight.w500))),
                ),
              ),
            );
          }),
          separatorBuilder: ((context, index) {
            return Container(
              width: 1,
              margin: const EdgeInsets.symmetric(vertical: 10),
              color: Color.fromARGB(255, 196, 192, 192),
            );
          }),
          itemCount: controller.dataList.length)),
    );
  }

  Widget tuijianWidget1() {
    return Obx(() => Container(
          width: 1.sw,
          margin: EdgeInsets.symmetric(horizontal: 18),
          child: ListView.separated(
              padding: EdgeInsets.zero,
              shrinkWrap: true,
              // physics: NeverScrollableScrollPhysics(),
              itemBuilder: ((context, index) {
                Map item = controller.list[index];
                return InkWell(
                  onTap: () {
                    controller.toServeInfo(item);
                  },
                  child: Container(
                    padding: EdgeInsets.symmetric(horizontal: 12, vertical: 10),
                    decoration: BoxDecoration(
                      color: ColorConfig.white,
                      // border: Border.all(color: ColorConfig.app_main, width: .5),
                      borderRadius: BorderRadius.all(Radius.circular(10.r)),
                    ),
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                          clipBehavior: Clip.hardEdge,
                          decoration: const BoxDecoration(
                            // border: Border.all(color: ColorConfig.app_main, width: .5),
                            borderRadius: BorderRadius.all(Radius.circular(8)),
                          ),
                          child: LoadNetworkImageWidget(
                              width: (1.sw - 36 - 16) / 3,
                              height: (1.sw - 36 - 16) / 3,
                              imageUrl: item['projectPic'] ?? ""),
                        ),
                        const SizedBox(width: 15),
                        Expanded(
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              const SizedBox(height: 5),
                              Text(item['projectName'] ?? "",
                                  style: TextStyle(
                                    fontSize: 16.sp,
                                    color: ColorConfig.text_label,
                                  )),
                              const SizedBox(height: 16),
                              Row(
                                children: [
                                  Text(
                                      (item['projectFeatures'] ?? []).join('|'),
                                      style: TextStyle(
                                        fontSize: 14.sp,
                                        color: Color(0xFF5A5A5A),
                                      )),
                                ],
                              ),
                              const SizedBox(height: 16),
                              Row(
                                children: [
                                  Container(
                                    decoration: BoxDecoration(
                                      color: Color(0xFFC9EBB8),
                                      // border: Border.all(color: ColorConfig.app_main, width: .5),
                                      borderRadius: BorderRadius.all(
                                          Radius.circular(5.r)),
                                    ),
                                    padding: const EdgeInsets.symmetric(
                                        horizontal: 6, vertical: 3),
                                    child: Text(item['projectTimer'] ?? "",
                                        style: TextStyle(
                                          fontSize: 12.sp,
                                          color: ColorConfig.app_main,
                                        )),
                                  ),
                                  const SizedBox(width: 10),
                                  Text('${item['projectPrice'] ?? ""}/人',
                                      style: TextStyle(
                                        fontSize: 12.sp,
                                        color: Color(0xFF5A5A5A),
                                      )),
                                  const Spacer(),
                                  InkWell(
                                    onTap: () {
                                      controller.toYue(item);
                                    },
                                    child: Container(
                                      decoration: BoxDecoration(
                                        color: ColorConfig.app_main,
                                        // border: Border.all(color: ColorConfig.app_main, width: .5),
                                        borderRadius: BorderRadius.all(
                                            Radius.circular(5.r)),
                                      ),
                                      padding: const EdgeInsets.symmetric(
                                          horizontal: 13, vertical: 5),
                                      child: Text('预约',
                                          style: TextStyle(
                                            fontSize: 12.sp,
                                            color: ColorConfig.white,
                                          )),
                                    ),
                                  ),
                                ],
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                );
              }),
              separatorBuilder: ((context, index) {
                return Container(height: 10);
              }),
              itemCount: controller.list.length),
        ));
  }
}
